@import "../../assets/css/mixin.scss";
@import "../../assets/css/icon.scss";
$border-1px-color: rgba(7,17,27,.1);

.border-1px,
.border-bottom-1px,
.border-top-1px,
.border-left-1px,
.border-right-1px {
   position: relative;
   &::after {
     /*线条颜色*/
     background-color: $border-1px-color;
     content:"";
     position: absolute;
   }
 }

 /*底边边框一像素*/
.border-bottom-1px::after {
   left: 0;
   bottom: 0;
   width: 100%;
   height: 1px;
   transform-origin: 0 0;
 }

 /*上边边框一像素*/
.border-top-1px::after {
  left: 0;
  top: 0;
  width: 100%;
  height: 1px;
  transform-origin: 0 0;
}

 /*左边边框一像素*/
.border-left-1px::after {
  left: 0;
  top: 0;
  width: 1px;
  height: 100%;
  transform-origin: 0 0;
 }
/*右边边框1像素*/
.border-right-1px::after {
  box-sizing: border-box;
  right: 0;
  top: 0;
  width: 1px;
  height: 100%;
  transform-origin: 0 0;
 }
/*边框一像素*/
.border-1px::after {
  box-sizing: border-box;
  left: 0;
  top: 0;
  width: 100%;
  height: 100%;
}

/*设备像素比*/
@include screen-min-dpr(2.0, 2dppx) {
  .border-bottom-1px, .border-top-1px {
    &::after { transform: scaleY(0.5) }
  }
 .border-left-1px, .border-right-1px {
   &::after { transform: scaleX(0.5); }
  }
 .border-1px::after {
      width: 200%;
      height: 200%;
      transform: scale(0.5);
      transform-origin: 0 0;
   }
}

/*设备像素比*/
@include screen-min-dpr(1.5, 1.5dppx) {
  .border-bottom-1px, .border-top-1px {
    &::after { transform: scaleY(0.7) }
  }
 .border-left-1px, .border-right-1px {
   &::after { transform: scaleX(0.7); }
  }
 .border-1px::after {
      width: 200%;
      height: 200%;
      transform: scale(0.5);
      transform-origin: 0 0;
   }
}

/*设备像素比*/
// @media only screen and (-webkit-min-device-pixel-ratio: 3.0), only screen and (min-resolution: 3dppx) {
@include screen-min-dpr(3.0, 3dppx) {
   .border-bottom-1px, .border-top-1px {
      &::aftetr { ansform: scaleY(0.333) }
   }
   .border-left-1px::after, .border-right-1px::after {
     &::aftetr { transform: scaleX(0.333) }
   }
  .border-1px::after {
      width: 300%;
      height: 300%;
      transform: scale(0.333);
      transform-origin: 0 0;
  }
}
